<template>
  <div class="controller" >
    <!-- <div>图片 <img class="img" :src="dataurl" alt="" width="300" height="300" /></div> -->
    <ReadWatermark text="版权所有" >
      <div class="content">
        动态生成: 根据参数动态生成水印图片
        Base64 格式: 返回 base64 URL，无需网络请求
      </div>
    </ReadWatermark>
    <ReadWatermark text="禁止转载" style="background: #28c840;" >
      <div class="content">2</div>
    </ReadWatermark>
  </div>
</template>

<script setup>
import ReadWatermark from '@/components/ReadWatermark.vue'
// import dataurl from '@/img/dataurl?raw'
// console.log("dataurl---")
// console.log(dataurl)
</script>

<style scoped>
.controller {
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;

}
.content {
  text-align: center; 

}

</style>